<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch">
      <el-form-item label="县区" prop="city" v-show="cityShow">
        <el-select
          v-model="queryParams.city"
          clearable
          placeholder="请选择"
          size="small"
          @change="selectCity"
        >
          <el-option
            v-for="item in this.cityData"
            :key="item.deptCode"
            :label="item.deptName"
            :value="item.deptCode">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="乡镇" prop="town" v-show="townShow">
        <el-select
          v-model="queryParams.town"
          clearable
          placeholder="请选择"
          size="small"
          @change="selectTown"
        >
          <el-option
            v-for="item in this.townData"
            :key="item.deptCode"
            :label="item.deptName"
            :value="item.deptCode">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="村" prop="village" v-show="villageShow">
        <el-select
          v-model="queryParams.village"
          clearable
          placeholder="请选择"
          size="small"
          @change="selectVillage"
        >
          <el-option
            v-for="item in this.villageData"
            :key="item.deptCode"
            :label="item.deptName"
            :value="item.deptCode">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="合同签订年份" prop="year">
        <el-date-picker
          v-model="queryParams.year"
          value-format="yyyy"
          type="year"
          placeholder="选择合同签订年份">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="复审状态" prop="shzt">
        <el-select
          v-model="queryParams.shzt"
          clearable
          placeholder="请选择"
          size="small"
          style="width: 240px"
        >
          <el-option
            v-for="dict in contractOptions"
            :key="dict.dictValue"
            :label="dict.dictLabel"
            :value="dict.dictValue"
          />
        </el-select>
      </el-form-item>

      <el-form-item label="名称" prop="jfmc">
        <el-input
          v-model="queryParams.jfmc"
          placeholder="请输入甲方或乙方名称"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['contract:contract:add']"
        >新增
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['contract:contract:remove']"
        >删除
        </el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>
    <el-table v-loading="loading" :data="CBHTList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" :selectable='checkboxT'/>
      <el-table-column label="合同编号" width="200" align="center" prop="htbm"/>
      <el-table-column label="甲方名称" width="80" align="center" prop="jfmc"/>
      <el-table-column label="乙方名称" width="90" align="center" prop="cbfmc"/>
      <el-table-column label="丙方名称" width="100"  align="center" prop="dsfmc"/>
      <el-table-column label="国有土地" align="center">
        <el-table-column
          align="center"
          prop="statistics.gyTotalArea"
          label="面积（亩）"
          width="120">
          <template slot-scope="scope">
            <div>{{ scope.row.statistics.gyTotalArea == 0 ? "-" : scope.row.statistics.gyTotalArea }}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="statistics.gyTotalPrice"
          label="金额（元）"
          width="120">
          <template slot-scope="scope">
            <div>
              {{
                scope.row.statistics.gyTotalPrice == 0 ? "-" : (String(scope.row.statistics.gyTotalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,').split('.').length < 2 ? String(scope.row.statistics.gyTotalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') + ".00" : String(scope.row.statistics.gyTotalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'))
              }}
            </div>
          </template>
        </el-table-column>
      </el-table-column>
      <el-table-column label="集体土地" align="center">
        <el-table-column
          align="center"
          prop="statistics.jtTotalArea"
          label="面积（亩）"
          width="120">
          <template slot-scope="scope">
            <div>{{ scope.row.statistics.jtTotalArea == 0 ? "-" : scope.row.statistics.jtTotalArea }}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="statistics.jtTotalPrice"
          label="金额（元）"
          width="120">
          <template slot-scope="scope">
            <div> {{
                scope.row.statistics.jtTotalPrice == 0 ? "-" : (String(scope.row.statistics.jtTotalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,').split('.').length < 2 ? String(scope.row.statistics.jtTotalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') + ".00" : String(scope.row.statistics.jtTotalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'))
              }}
            </div>
          </template>
        </el-table-column>
      </el-table-column>
      <el-table-column label="附着物" align="center">
        <el-table-column
          align="center"
          prop="statistics.scTotalArea"
          label="面积（亩）"
          width="120">
          <template slot-scope="scope">
            <div>{{ scope.row.statistics.scTotalArea == 0 ? "-" : scope.row.statistics.scTotalArea }}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="statistics.jtTotalPrice"
          label="金额（元）"
          width="120">
          <template slot-scope="scope">
            <div style="line-height: 23px; text-align: left;" v-show="scope.row.statistics.qmTotalPrice !=0">
              {{
                scope.row.statistics.qmTotalPrice == 0 ? "-" : (String(scope.row.statistics.qmTotalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,').split('.').length < 2 ? String(scope.row.statistics.qmTotalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') + ".00" : String(scope.row.statistics.qmTotalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'))
              }}
            </div>
          </template>
        </el-table-column>
      </el-table-column>
      <el-table-column label="地上附属物" align="center">
        <el-table-column
          align="center"
          prop="statistics.fswTotalPrice"
          label="面积（亩）"
          width="120">
          <template slot-scope="scope">
            <div>{{ scope.row.statistics.fswTotalPrice == 0 ? "-" : scope.row.statistics.fswTotalPrice }}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="statistics.fswTotalPrice"
          label="金额（元）"
          width="120">
          <template slot-scope="scope">
            <div style="line-height: 23px; text-align: center;" >
              {{
                scope.row.statistics.fswTotalPrice == 0 ? "-" : (String(scope.row.statistics.fswTotalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,').split('.').length < 2 ? String(scope.row.statistics.fswTotalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') + ".00" : String(scope.row.statistics.fswTotalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'))
              }}
            </div>
          </template>
        </el-table-column>
      </el-table-column>
      <el-table-column label="总面积（亩）"  width="130" align="center" prop="statistics.scTotalArea"/>
      <el-table-column label="合同金额（元）" width="130" align="center" prop="statistics.totalPrice">
        <template slot-scope="scope">
          {{
            scope.row.statistics.totalPrice == 0 ? "-" : (String(scope.row.statistics.totalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,').split('.').length < 2 ? String(scope.row.statistics.totalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') + ".00" : String(scope.row.statistics.totalPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'))
          }}
        </template>
      </el-table-column>
      <el-table-column label="地块数"  align="center" prop="statistics.cbfTotalNumber"/>
      <el-table-column fixed="right" label="审核状态" width="90" :formatter="contractFormat" align="center" prop="shzt">
        <template slot-scope="scope">
          <div class="statusDv">
            <div class="statudPoint" :class="'Bg'+scope.row['shzt']"></div>
            <div v-for="sta in contractOptions" v-if="sta.dictValue == scope.row['shzt']">{{ sta.dictLabel }}</div>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="附件" width="80" align="center" prop="htwj">
        <template slot-scope="scope">
          <div class="statusDv">
            <div v-if="scope.row['htfj']==''||scope.row['htfj']==undefined||scope.row['htfj']==null" style="color: orange">未上传</div>
            <div v-else  style="color:#13ce66">已上传</div>
          </div>
        </template>
      </el-table-column>
      <el-table-column fixed="right" width="200" label="操作" align="center" class-name="small-padding fixed-width" >
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-details"
            @click="handleView(scope.row)"
            v-hasPermi="['contract:contract:query']"
          >
            <svg-icon class="svg" icon-class="details"/>
            合同预览
          </el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-details"
            @click="handleListDetails(scope.row)"
            v-hasPermi="['contract:contract:query']"
          >
            <svg-icon class="svg" icon-class="details"/>
            详情
          </el-button>
          <el-button
            v-if="scope.row.shzt==0||scope.row.shzt==3"
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['contract:contract:editStatistics']"
          >修改
          </el-button>
          <el-button
            v-if="scope.row.shzt==0||scope.row.shzt==1"
            size="mini"
            type="text"
            @click="handleUpdateFj(scope.row)"
            v-hasPermi="['contract:contract:editStatistics']"
          >             <svg-icon class="svg" icon-class="annex"/>
            附件上传
          </el-button>
          <el-button
            v-if="scope.row.shzt==0"
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['contract:contract:removeStatistics']"
          >删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
  <!--  <el-table v-loading="loading" :data="CBHTList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" :selectable='checkboxT'/>
      <el-table-column label="合同编号" width="200" align="center" prop="htbm"/>
      <el-table-column label="甲方名称" width="100" align="center" prop="jfmc"/>
      <el-table-column label="乙方名称" align="center" prop="cbfmc"/>
      <el-table-column label="面积（亩）" width="100" align="center" prop="htmj"/>
      <el-table-column label="合同金额（元）" width="120" align="center" prop="htzje">
        <template slot-scope="scope">
          {{
            scope.row.htzje == 0 ? "-" : (String(scope.row.htzje).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,').split('.').length < 2 ? String(scope.row.htzje).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') + ".00" : String(scope.row.htzje).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'))
          }}
        </template>
      </el-table-column>
      <el-table-column label="收款方" align="center" prop="skrmc"/>
      <el-table-column label="收款方账号" width="120" align="center" prop="skrkh">
        <template slot-scope="scope">
          {{ scope.row.skrkh ? scope.row.skrkh.replace(/^(\d{4})\d+(\d{4})$/, "$1******$2") : "" }}
        </template>
      </el-table-column>
      <el-table-column label="复审状态" width="90" align="center" prop="shzt">
        <template slot-scope="scope">
          <div class="statusDv">
            <div class="statudPoint" :class="'Bg'+scope.row['shzt']"></div>
            <div v-for="sta in contractOptions" v-if="sta.dictValue == scope.row['shzt']">{{ sta.dictLabel }}</div>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="附件" width="80" align="center" prop="htfj">
        <template slot-scope="scope">
          <div class="statusDv">
            <div v-if="scope.row['htfj']==''||scope.row['htfj']==undefined||scope.row['htfj']==null"
                 style="color: orange">未上传
            </div>
            <div v-else style="color:#13ce66">已上传</div>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-details"
            @click="handleView(scope.row)"
            v-hasPermi="['contract:contract:query']"
          >
            <svg-icon class="svg" icon-class="details"/>
            合同预览
          </el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-details"
            @click="handleListDetails(scope.row)"
            v-hasPermi="['contract:contract:query']"
          >
            <svg-icon class="svg" icon-class="details"/>
            详情
          </el-button>
          <el-button
            v-if="scope.row.shzt==0||scope.row.shzt==3"
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['contract:contract:edit']"
          >修改
          </el-button>
          <el-button
            v-if="scope.row.shzt==0||scope.row.shzt==1"
            size="mini"
            type="text"
            @click="handleUpdateFj(scope.row)"
            v-hasPermi="['contract:contract:edit']"
          >
            <svg-icon class="svg" icon-class="annex"/>
            附件上传
          </el-button>
          <el-button
            size="mini"
            type="text"
            v-if="scope.row.shzt==2"
            icon="el-icon-edit"
            @click="handleChange(scope.row)"
            v-hasPermi="['contract:contract:edit']"
          >合同变更
          </el-button>
          <el-button
            size="mini"
            type="text"
            v-if="scope.row.shzt==2"
            @click="handleChangeRecord(scope.row)"
            v-hasPermi="['contract:contract:edit']"
          >
            <svg-icon class="svg" icon-class="records"/>
            变更记录
          </el-button>
          <el-button v-if="scope.row.shzt==0"
                     size="mini"
                     type="text"
                     icon="el-icon-delete"
                     @click="handleDelete(scope.row)"
                     v-hasPermi="['contract:contract:remove']"
          >删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />-->

    <el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body @close="cancel">
      <el-form ref="form" :model="form" :rules="rules" label-width="95px">
        <el-row>
          <el-col :span="24">
            <el-form-item label="组织机构" prop="deptName">
              <treeselect
                v-model="form.deptName"
                :options="deptOptions"
                :normalizer="normalizer"
                :show-count="true"
                :default-expand-level="2"
                placeholder="选择机构"
                @select="selectDepart"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="合同类型" prop="httype">
              <el-select v-model="form.httype" style="width: 100%">
                <el-option
                  v-for="dict in this.contractTypeOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="合同编号" prop="htbm">
              <el-input v-model="form.htbm" placeholder="请输入合同编号" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="甲方名称" prop="jfmc">
              <el-input v-model="form.jfmc" placeholder="请选择组织机构，自动填充" readonly @click.native="handleSelectJf"/>
              <el-input v-show="1==2" v-model="form.jfbm"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="甲方证件号" prop="jfzjhm">
              <el-input v-model="form.jfzjhm" placeholder="请输入甲方证件号"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="乙方名称" prop="cbfmc">
              <el-input v-model="form.cbfmc" ref="cbfmc1" placeholder="请选择乙方名称" readonly
                        @click.native="handleSelectCbf"/>
            </el-form-item>
            <el-input v-show="1==2" v-model="form.cbfbm"/>
          </el-col>
          <el-col :span="12">
            <el-form-item label="乙方证件号" prop="cbfzjhm">
              <el-input v-model="form.cbfzjhm" placeholder="请输入乙方证件号"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="地块编码" prop="dkbm">
              <el-select v-model="form.dkbm" placeholder="请选择" style="width: 100%"
                         @change="selectDk"
              >
                <el-option
                  v-for="item in this.dkData"
                  :key="item.dkbm"
                  :label="item.dkbm"
                  :value="item.dkbm">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="地块名称" prop="dkmc">
              <el-input v-model="form.dkmc" placeholder="请输入地块名称"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="面积（亩）" prop="htmj">
              <el-input v-model="form.htmj" placeholder="自动填充" disabled/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话" prop="dsfdh">
              <el-input v-model="form.dsfdh" placeholder="请输入联系电话"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="收款方" prop="skrmc">
              <el-input v-model="form.skrmc" placeholder="请输入收款方"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="收款方账号" prop="skrkh">
              <el-input v-model="form.skrkh" placeholder="请输入收款方账号" @input="formatCardNumber" ref="cardInput"/>
              <!--              <el-input v-model="form.skrkh" placeholder="请输入收款方账号"/>-->
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="开户行" prop="skrkhh">
              <el-input ref="skrkhh" placeholder="请输入开户行" v-model="form.skrkhh" class="input-with-select">
                <el-button slot="append" @click.native="handleSelectBank">请选择</el-button>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联行号" prop="skryhbh">
              <el-input v-model="form.skryhbh" placeholder="请输入联行号"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="承包期限起" prop="cbqxq">
              <el-date-picker clearable size="small" style="width: 100%"
                              v-model="form.cbqxq"
                              type="date"
                              :picker-options="startDatePicker"
                              value-format="yyyy-MM-dd"
                              placeholder="选择承包期限起">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="承包期限止" prop="cbqxz">
              <el-date-picker clearable size="small" style=" width: 100%"
                              v-model="form.cbqxz"
                              type="date"
                              :picker-options="endDatePicker"
                              value-format="yyyy-MM-dd"
                              placeholder="选择承包期限止">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-table v-loading="loading" :data="pgList" ref="pgTable"
                      @selection-change="handlePgSelectionChange">
              <el-table-column type="selection" width="55" align="center"/>
              <el-table-column label="类别" align="center" prop="compensationType" :formatter="compensationtypeFormat"/>
              <el-table-column label="评估项" align="center" prop="evaluationItemName"/>
              <el-table-column label="面积（亩）" align="center" prop="evaluationArea"/>
              <el-table-column label="单价（元）" align="center" prop="evaluationItemPrice">
                <template slot-scope="scope">
                  {{
                    scope.row.evaluationItemPrice == 0 ? "-" : (String(scope.row.evaluationItemPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,').split('.').length < 2 ? String(scope.row.evaluationItemPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') + ".00" : String(scope.row.evaluationItemPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'))
                  }}
                </template>
              </el-table-column>
              <el-table-column label="评估金额（元）" align="center" prop="price">
                <template slot-scope="scope">
                  {{
                    scope.row.price == 0 ? "-" : (String(scope.row.price).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,').split('.').length < 2 ? String(scope.row.price).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') + ".00" : String(scope.row.price).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'))
                  }}
                </template>
              </el-table-column>
            </el-table>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="合同金额" prop="htzje">
              <el-input v-model="form.htzje" placeholder="请选择评估项，自动计算" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="备注" prop="remark">
          <el-input type="textarea" v-model="form.remark" placeholder="请输入备注"/>
        </el-form-item>
        <el-form-item label="附件" prop="htfj">
          <!--          :before-remove="beforeRemove"-->

          <el-upload
            class="avatar-uploader"
            list-type="picture-card"
            :file-list="fileList"
            :action="productFileAction"
            :before-upload="beforeUpload"
            :headers="headers"
            :on-preview="handlePreview"
            :on-remove="handleRemove"
            :onSuccess="uploadSuccess"
            :on-exceed="masterFileMax"
            :limit=limit
            multiple
            accept="image/*"
            name="uploadfiles">
            <i class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
          <el-input type="textarea" v-show="1==2" v-model="form.htfj" placeholder="请输入附加"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <!--    附件上传-->
    <el-dialog :title="title" :visible.sync="openfj" width="900px" append-to-body @close="cancel">
      <el-form ref="form" :model="form" :rules="rules" label-width="95px">
        <el-form-item label="附件" prop="htfj">
          <!--            :before-remove="beforeRemove"-->
          <el-upload
            class="avatar-uploader"
            :action="productFileAction"
            :file-list="fileList"
            list-type="picture-card"
            :before-upload="beforeUpload"
            :headers="headers"
            :on-preview="handlePreview"
            :on-remove="handleRemove"
            :on-success="uploadSuccess"
            :on-exceed="masterFileMax"
            :limit=limit
            multiple
            accept="image/*"
            name="uploadfiles">
            <i class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
                    <el-input type="textarea" v-show="1==2" v-model="form.htfj" placeholder="请输入附加"/>
<!--          <el-input type="textarea" v-model="form.htfj" placeholder="请输入附加"/>-->
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFormFj">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

<!--    详情-->
    <el-dialog :title="title" :visible.sync="openListDetails" width="900px" append-to-body @close="cancel">
      <el-form ref="form" :model="form"label-width="95px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="合同类型" prop="httype">
              <el-select v-model="form.httype" style="width: 100%" disabled>
                <el-option
                  v-for="dict in this.contractTypeOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="合同编号" prop="htbm">
              <el-input v-model="form.htbm" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="甲方名称" prop="jfmc">
              <el-input v-model="form.jfmc" disabled/>
              <el-input v-show="1==2" v-model="form.jfbm"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="甲方证件号" prop="jfzjhm">
              <el-input v-model="form.jfzjhm" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="乙方名称" prop="cbfmc">
              <el-input v-model="form.cbfmc" ref="cbfmc" disabled/>
            </el-form-item>
            <el-input v-show="1==2" v-model="form.cbfbm"/>
          </el-col>
          <el-col :span="12">
            <el-form-item label="乙方证件号" prop="cbfzjhm">
              <el-input v-model="form.cbfzjhm" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="地块编码" prop="dkbm">
              <el-select v-model="form.dkbm" placeholder="请选择" style="width: 100%"
                         disabled
              >
                <el-option
                  v-for="item in this.dkData"
                  :key="item.dkbm"
                  :label="item.dkbm"
                  :value="item.dkbm">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="地块名称" prop="dkmc">
              <el-input v-model="form.dkmc" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="面积（亩）" prop="htmj">
              <el-input v-model="form.htmj" disabled/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话" prop="dsfdh">
              <el-input v-model="form.dsfdh" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="收款方" prop="skrmc">
              <el-input v-model="form.skrmc" disabled/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="收款方账号" prop="skrkh">
              <el-input v-model="form.skrkh" disabled ref="cardInput"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="开户行" prop="skrkhh">
              <el-input ref="skrkhh" v-model="form.skrkhh" disabled/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联行号" prop="skryhbh">
              <el-input ref="skryhbh" v-model="form.skryhbh" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="承包期限起" prop="cbqxq">
              <el-date-picker clearable size="small" style="width: 100%"
                              v-model="form.cbqxq"
                              type="date"
                              disabled
                              value-format="yyyy-MM-dd"
                              placeholder="选择承包期限起">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="承包期限止" prop="cbqxz">
              <el-date-picker clearable size="small" style=" width: 100%"
                              v-model="form.cbqxz"
                              type="date"
                              disabled
                              value-format="yyyy-MM-dd"
                              placeholder="选择承包期限止">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-table v-loading="loading" :data="pgList" ref="pgTable"
                      @selection-change="handlePgSelectionChange">
              <el-table-column label="类别" align="center" prop="compensationType" :formatter="compensationtypeFormat"/>
              <el-table-column label="评估项" align="center" prop="evaluationItemName"/>
              <el-table-column label="面积（亩）" align="center" prop="evaluationArea"/>
              <el-table-column label="单价（元）" align="center" prop="evaluationItemPrice">
                <template slot-scope="scope">
                  {{
                    scope.row.evaluationItemPrice == 0 ? "-" : String(scope.row.evaluationItemPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,')
                  }}
                </template>
              </el-table-column>
              <el-table-column label="评估金额（元）" align="center" prop="price"/>
            </el-table>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="合同金额" prop="htzje">
              <el-input v-model="form.htzje" placeholder="请选择评估项，自动计算" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="备注" prop="remark">
          <el-input type="textarea" v-model="form.remark" disabled/>
        </el-form-item>
        <el-form-item label="附件" prop="htfj">
          <el-upload
            disabled
            class="avatar-uploader"
            list-type="picture-card"
            :file-list="fileList"
            :action="productFileAction"
            :before-upload="beforeUpload"
            :headers="headers"
            :on-preview="handlePreview"
            :on-remove="handleRemove"
            :before-remove="beforeRemove"
            :onSuccess="uploadSuccess"
            multiple
            accept="image/*"
            name="uploadfiles">
            <i class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
          <el-input type="textarea" v-show="1==2" v-model="form.htfj" placeholder="请输入附加"/>
        </el-form-item>
      </el-form>
      <el-table v-show="recordList.length>0" v-loading="loading" :data="recordList"
                @selection-change="handleSelectionChange">
        <el-table-column label="审核人" align="center" prop="approvalName"/>
        <el-table-column label="审核时间" align="center" prop="approvalTime"/>
        <el-table-column label="审核状态" align="center" prop="state">
          <template slot-scope="scope">
            <div class="statusDv">
              <div class="statudPoint" :class="'Bg'+scope.row['state']"></div>
              <div v-for="sta in contractOptions" v-if="sta.dictValue == scope.row['state']">{{ sta.dictLabel }}</div>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="审核意见" align="center" prop="remark"/>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="cancel">确 定</el-button>
      </div>
    </el-dialog>

    <!--变更-->
    <el-dialog :title="title" :visible.sync="openbg" width="900px" append-to-body @close="cancel">
      <el-form ref="form" :model="form" :rules="rules" label-width="95px">
        <el-row>
          <el-col :span="24">
            <el-form-item label="组织机构" prop="deptName">
              <treeselect
                disabled
                v-model="form.deptName"
                :options="deptOptions"
                :normalizer="normalizer"
                :show-count="true"
                :default-expand-level="2"
                placeholder="选择机构"
                @select="selectDepart"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="合同类型" prop="httype">
              <el-select v-model="form.httype" style="width: 100%">
                <el-option
                  v-for="dict in this.contractTypeOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="合同编号" prop="htbm">
              <el-input v-model="form.htbm" placeholder="请输入合同编号" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="甲方名称" prop="jfmc">
              <el-input v-model="form.jfmc" placeholder="请选择组织机构，自动填充" disabled/>
              <el-input v-show="1==2" v-model="form.jfbm"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="甲方证件号" prop="jfzjhm">
              <el-input v-model="form.jfzjhm" placeholder="请输入甲方证件号"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="乙方名称" prop="cbfmc">
              <el-input v-model="form.cbfmc" ref="cbfmc" placeholder="请选择乙方名称" disabled/>
            </el-form-item>
            <el-input v-show="1==2" v-model="form.cbfbm"/>
          </el-col>
          <el-col :span="12">
            <el-form-item label="乙方证件号" prop="cbfzjhm">
              <el-input v-model="form.cbfzjhm" placeholder="请输入乙方证件号"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="地块编码" prop="dkbm">
              <el-select v-model="form.dkbm" placeholder="请选择" style="width: 100%"
                         @change="selectDk"
                         disabled
              >
                <el-option
                  v-for="item in this.dkData"
                  :key="item.dkbm"
                  :label="item.dkbm"
                  :value="item.dkbm">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="地块名称" prop="dkmc">
              <el-input v-model="form.dkmc" placeholder="请输入地块名称"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="面积（亩）" prop="htmj">
              <el-input v-model="form.htmj" placeholder="自动填充" readonly/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话" prop="dsfdh">
              <el-input v-model="form.dsfdh" placeholder="请输入联系电话"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="收款方" prop="skrmc">
              <el-input v-model="form.skrmc" placeholder="请输入收款方"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="收款方账号" prop="skrkh">
              <el-input v-model="form.skrkh" placeholder="请输入收款方账号" @input="formatCardNumber" ref="cardInput"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="开户行" prop="skrkhh">
              <!--              <el-input ref="skrkhh" v-model="form.skrkhh" placeholder="请输入开户行" @click.native="handleSelectBank"/>-->
              <el-input ref="skrkhh" placeholder="请输入开户行" v-model="form.skrkhh" class="input-with-select">
                <el-button slot="append" @click.native="handleSelectBank">请选择</el-button>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联行号" prop="skryhbh">
              <el-input v-model="form.skryhbh" placeholder="请输入联行号"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="承包期限起" prop="cbqxq">
              <el-date-picker clearable size="small" style="width: 100%"
                              v-model="form.cbqxq"
                              type="date"
                              :picker-options="startDatePicker"
                              value-format="yyyy-MM-dd"
                              placeholder="选择承包期限起">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="承包期限止" prop="cbqxz">
              <el-date-picker clearable size="small" style=" width: 100%"
                              v-model="form.cbqxz"
                              type="date"
                              :picker-options="endDatePicker"
                              value-format="yyyy-MM-dd"
                              placeholder="选择承包期限止">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-table v-loading="loading" :data="pgList" ref="pgTable"
                      @selection-change="handlePgSelectionChange">
              <el-table-column type="selection" width="55" align="center"/>
              <el-table-column label="评估项" align="center" prop="evaluationItemName"/>
              <el-table-column label="面积（亩）" align="center" prop="evaluationArea"/>
              <el-table-column label="单价（元）" align="center" prop="evaluationItemPrice">
                <template slot-scope="scope">
                  {{
                    scope.row.evaluationItemPrice == 0 ? "-" : (String(scope.row.evaluationItemPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,').split('.').length < 2 ? String(scope.row.evaluationItemPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') + ".00" : String(scope.row.evaluationItemPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'))
                  }}
                </template>
              </el-table-column>
              <el-table-column label="评估金额（元）" align="center" prop="price">
                <template slot-scope="scope">
                  {{
                    scope.row.price == 0 ? "-" : (String(scope.row.price).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,').split('.').length < 2 ? String(scope.row.price).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') + ".00" : String(scope.row.price).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,'))
                  }}
                </template>
              </el-table-column>
            </el-table>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="合同金额" prop="htzje">
              <el-input v-model="form.htzje" placeholder="请选择评估项，自动计算" readonly/>
            </el-form-item>
          </el-col>
          <el-col :span="12">

          </el-col>
        </el-row>
        <el-form-item label="备注" prop="remark">
          <el-input type="textarea" v-model="form.remark" placeholder="请输入备注"/>
        </el-form-item>
        <el-form-item label="附件" prop="htfj">
          <el-upload
            class="avatar-uploader"
            list-type="picture-card"
            :file-list="fileList"
            :action="productFileAction"
            :before-upload="beforeUpload"
            :headers="headers"
            :on-preview="handlePreview"
            :on-remove="handleRemove"
            :before-remove="beforeRemove"
            :onSuccess="uploadSuccess"
            multiple
            :limit=5
            accept="image/*"
            name="uploadfiles">
            <i class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
          <el-input type="textarea" v-show="1==2" v-model="form.htfj" placeholder="请输入附加"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitChangeForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <el-dialog :visible.sync="dialogVisible">
      <img width="100%" :src="dialogImageUrl" alt="">
    </el-dialog>

    <!--选择承包方-->
    <el-dialog :title="'承包方信息'" :visible.sync="opencbf" width="1000px">
      <el-form :model="queryCbfParams" ref="queryCbfForm" :inline="true" v-show="showSearch" label-width="88px">
        <el-form-item label="承包方名称">
          <el-input
            v-model="queryCbfParams.cbfmc"
            placeholder="请输入承包方名称"
            clearable
            size="small"
          />
          <!--          @keyup.enter.native="handleCbfQuery"-->
        </el-form-item>
        <el-form-item>
          <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleCbfQuery">搜索</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="resetCbfQuery">重置</el-button>
        </el-form-item>
      </el-form>
      <el-table v-loading="loading" :data="cbfList"
                ref="cbfTable"
                @select="handleCbfSelect"
                @current-change="handleCbfCurrentChange"
                row-key="deptId"
                :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
        <el-table-column type="selection" width="55" align="center"/>
        <el-table-column label="承包方编码" width="200" align="center" prop="cbfbm"/>
        <el-table-column label="承包方名称" align="center" prop="cbfmc"/>
        <el-table-column label="证件号码" align="center" prop="cbfzjhm"/>
        <!--        <el-table-column label="联系电话" align="center" prop="lxdh"/>-->
        <el-table-column label="承包方地址" align="center" prop="cbfdz"/>
      </el-table>
      <pagination
        v-show="cbftotal>0"
        :total="cbftotal"
        :page.sync="queryCbfParams.pageNum"
        :limit.sync="queryCbfParams.pageSize"
        @pagination="getCbfList"
      />
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="confirmCbf">确 定</el-button>
        <el-button @click="cancelCbf">取 消</el-button>
      </div>
    </el-dialog>

    <!--pdf查看-->
    <el-dialog :title="title"
               :visible.sync="openDetails"
               :close-on-click-modal="false"
               style="height:auto;"
               width="900"
               :fullscreen="true"
               ref="details"
    >
      <iframe :src="src" frameborder="0" style="width: 100%; height: 850px;" scrolling="no"></iframe>
    </el-dialog>

    <!--复审-->
    <el-dialog :title="title" :visible.sync="openfs" width="900px" append-to-body @close="cancelfs">
      <el-collapse v-model="activeName">
        <el-collapse-item title="合同信息 【点击查看详情】" name="1">
          <el-form ref="form" :model="form" :rules="rules" label-width="95px">
            <el-row>
              <el-col :span="24">
                <el-form-item label="组织机构">
                  <treeselect
                    disabled
                    v-model="form.deptName"
                    :options="deptOptions"
                    :normalizer="normalizer"
                    :show-count="true"
                    placeholder="选择机构"
                    @select="selectDepart"
                  />
                </el-form-item>
              </el-col>

            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="合同类型">
                  <el-select v-model="form.httype" style="width: 100%" disabled>
                    <el-option
                      v-for="dict in contractTypeOptions"
                      :key="dict.dictValue"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"/>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="合同编号">
                  <el-input v-model="form.htbm" placeholder="请输入合同编号" disabled/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="甲方名称">
                  <el-input v-model="form.jfmc" placeholder="请输入甲方名称" disabled/>
                  <el-input v-show="1==2" v-model="form.jfbm"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="甲方证件号" prop="jfzjhm">
                  <el-input v-model="form.jfzjhm" disabled/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="乙方名称" prop="cbfmc">
                  <el-input v-model="form.cbfmc" placeholder="请输入乙方名称" disabled/>
                  <el-input v-show="1==2" v-model="form.cbfbm"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="乙方证件号" prop="cbfzjhm">
                  <el-input v-model="form.cbfzjhm" disabled/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="地块编码">
                  <el-select v-model="form.dkbm" placeholder="请选择" style="width: 100%"
                             @change="selectDk" disabled
                  >
                    <el-option
                      v-for="item in this.dkData"
                      :key="item.dkmc"
                      :label="item.dkbm"
                      :value="item.dkbm">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="地块名称" prop="dkmc">
                  <el-input v-model="form.dkmc" disabled/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="面积（亩）">
                  <el-input v-model="form.htmj" placeholder="请输入面积" disabled/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="收款人">
                  <el-input v-model="form.skrmc" placeholder="请输入收款人" disabled/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="银行卡">
                  <el-input v-model="form.skrkh" placeholder="请输入银行卡" disabled @input="formatCardNumber"
                            ref="cardInput"/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="开户行">
                  <el-input v-model="form.skrkhh" placeholder="请输入开户行" disabled/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="承包期限起">
                  <el-date-picker disabled clearable size="small" style="width: 100%"
                                  v-model="form.cbqxq"
                                  type="date"
                                  value-format="yyyy-MM-dd"
                                  placeholder="选择承包期限起">
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="承包期限止">
                  <el-date-picker disabled clearable size="small" style="width: 100%"
                                  v-model="form.cbqxz"
                                  type="date"
                                  value-format="yyyy-MM-dd"
                                  placeholder="选择承包期限止">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-table v-loading="loading" :data="pgList">
                <el-table-column label="评估项" align="center" prop="evaluationItemName"/>
                <el-table-column label="面积（亩）" align="center" prop="evaluationArea"/>
                <el-table-column label="单价（元）" align="center" prop="evaluationItemPrice">
                  <template slot-scope="scope">
                    {{
                      scope.row.evaluationItemPrice == 0 ? "-" : String(scope.row.evaluationItemPrice).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,')
                    }}
                  </template>
                </el-table-column>
                <el-table-column label="评估金额（元）" align="center" prop="price">
                  <template slot-scope="scope">
                    {{ scope.row.price == 0 ? "-" : String(scope.row.price).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') }}
                  </template>
                </el-table-column>
              </el-table>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="12">
                <el-form-item label="合同金额">
                  <el-input v-model="form.htzje" disabled/>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="联系电话" prop="dsfdh">
                  <el-input v-model="form.dsfdh" disabled/>
                </el-form-item>
              </el-col>
            </el-row>
            <el-form-item label="备注" prop="remarks">
              <el-input type="textarea" v-model="form.remarks" disabled/>
            </el-form-item>
            <el-form-item label="附件" prop="fj">
              <!-- <el-upload
                 class="avatar-uploader"
                 list-type="picture-card"
                 disabled
                 :file-list="fileList"
                 :action="productFileAction"
                 :headers="headers"
                 :on-preview="handlePreview"
                 multiple
                 accept="image/*"
                 name="uploadfiles">
                 <i class="el-icon-plus avatar-uploader-icon"></i>
               </el-upload>-->

              <el-upload
                disabled
                class="avatar-uploader"
                list-type="picture-card"
                :file-list="fileList"
                :action="productFileAction"
                :before-upload="beforeUpload"
                :headers="headers"
                :on-preview="handlePreview"
                :on-remove="handleRemove"
                :before-remove="beforeRemove"
                multiple
                accept="image/*"
                name="uploadfiles">
                <i class="el-icon-plus avatar-uploader-icon"></i>
              </el-upload>
            </el-form-item>
          </el-form>
        </el-collapse-item>
      </el-collapse>
      <el-divider content-position="left">审核信息</el-divider>
      <el-form ref="formfs" :model="formfs" :rules="rules1" label-width="95px">
        <el-form-item label="复审状态" prop="status">
          <el-radio-group v-model="formfs.status">
            <el-radio v-for="item in approveStatus"
                      border
                      size="medium"
                      :label="item.dictValue">
              {{ item.dictLabel }}
            </el-radio>
          </el-radio-group>
          <!--<el-select
            v-model="formfs.status"
            clearable
            placeholder="请选择"
            size="small"
            style="width: 100%"
            @select="selectStatus"
          >
            <el-option
              v-for="dict in approveStatus"
              :key="dict.dictValue"
              :label="dict.dictLabel"
              :value="dict.dictValue">
            </el-option>
          </el-select>-->
        </el-form-item>
        <el-form-item label="复审意见" prop="remark">
          <el-input type="textarea" v-model="formfs.remark" placeholder="请输入复审意见"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFormfs">确 定</el-button>
        <el-button @click="cancelfs">取 消</el-button>
      </div>
    </el-dialog>

    <!--复审 批量-->
    <el-dialog :title="title" :visible.sync="openfspl" width="900px" append-to-body>
      <el-form ref="formfs" :model="formfs" :rules="rules" label-width="95px">
        <el-form-item label="复审状态" prop="status" required>
          <el-radio-group v-model="formfs.status">
            <el-radio v-for="item in approveStatus"
                      border
                      size="medium"
                      :label="item.dictValue">
              {{ item.dictLabel }}
            </el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="复审意见" prop="remark">
          <el-input type="textarea" v-model="formfs.remark" placeholder="请输入复审意见"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFormfs">确 定</el-button>
        <el-button @click="cancelfs">取 消</el-button>
      </div>
    </el-dialog>

    <!--选择开户行-->
    <el-dialog :title="'开户行信息'" :visible.sync="openbank" width="900px">
      <el-form :model="queryBankParams" ref="queryBankForm" :inline="true" v-show="showSearch">
        <el-form-item label="银行支行名称" prop="bankName">
          <el-input
            v-model="queryBankParams.bankName"
            placeholder="请输入银行支行名称"
            clearable
            size="small"
            @keyup.enter.native="handleBankQuery"
          />
        </el-form-item>
        <el-form-item label="联行号" prop="bankNumber">
          <el-input
            v-model="queryBankParams.bankNumber"
            placeholder="请输入联行号"
            clearable
            size="small"
            @keyup.enter.native="handleBankQuery"
          />
        </el-form-item>
        <el-form-item>
          <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleBankQuery">搜索</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="resetBankQuery">重置</el-button>
        </el-form-item>
      </el-form>
      <el-table v-loading="loadingBank"
                ref="bankTable"
                @select="handleBankSelect"
                @current-change="handleBankCurrentChange"
                row-key="id"
                :data="numberList">
        <el-table-column type="selection" width="55" align="center"/>
        <el-table-column label="银行支行名称" align="center" prop="bankName"/>
        <el-table-column label="联行号" align="center" prop="bankNumber"/>
        <!--      <el-table-column label="联行号" align="center" prop="bankCardNumber"/>-->
      </el-table>

      <pagination
        v-show="numbertotal>0"
        :total="numbertotal"
        :page.sync="queryBankParams.pageNum"
        :limit.sync="queryBankParams.pageSize"
        @pagination="getBankList"
      />
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="confirmBank">确 定</el-button>
        <el-button @click="cancelBank">取 消</el-button>
      </div>
    </el-dialog>

    <el-dialog title="审核记录" :visible.sync="openShjl" width="800px" append-to-body>
      <div style="min-height: 484px">
        <el-table v-loading="loading" :data="recordList" @selection-change="handleSelectionChange">
          <el-table-column label="审核人" align="center" prop="approvalName"/>
          <el-table-column label="审核时间" align="center" prop="approvalTime"/>
          <el-table-column label="审核状态" align="center" prop="state">
            <template slot-scope="scope">
              <div class="statusDv">
                <div class="statudPoint" :class="'Bg'+scope.row['state']"></div>
                <div v-for="sta in contractOptions" v-if="sta.dictValue == scope.row['state']">{{ sta.dictLabel }}</div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="审核意见" align="center" prop="remark"/>
        </el-table>
      </div>
      <pagination
        v-show="recordtotal>0"
        :total="recordtotal"
        :page.sync="queryExamineParams.pageNum"
        :limit.sync="queryExamineParams.pageSize"
        @pagination="getRecordList"
      />
    </el-dialog>

    <el-dialog title="变更记录" :visible.sync="openBgjl" width="1000px" append-to-body>
      <div style="min-height: 484px">
        <el-table v-loading="loading" :data="changeRecordList">
          <el-table-column fixed label="合同编号" width="200" align="center" prop="htbm"/>
          <el-table-column fixed label="甲方名称" align="center" prop="jfmc"/>
          <el-table-column fixed label="乙方名称" width="190" align="center" prop="cbfmc"/>
          <el-table-column label="面积（亩）" width="120" align="center" prop="htmj"/>
          <el-table-column width="120" label="合同金额（元）" align="center" prop="htzje">
            <template slot-scope="scope">
              {{ scope.row.htzje == 0 ? "-" : String(scope.row.htzje).replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') }}
            </template>
          </el-table-column>
          <el-table-column width="120" label="收款人" align="center" prop="skrmc"/>
          <el-table-column width="200" label="银行卡" align="center" prop="skrkh">
            <template slot-scope="scope">
              {{ scope.row.skrkh ? scope.row.skrkh.replace(/^(\d{4})\d+(\d{4})$/, "$1******$2") : "" }}
            </template>
          </el-table-column>
          <el-table-column label="变更时间" align="center" prop="updateTime" width="120">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.updateTime,'{y}-{m}-{d}') }}</span>
            </template>
          </el-table-column>
          <el-table-column  fixed="right" label="操作" align="center" class-name="small-padding fixed-width">
            <template slot-scope="scope">
              <el-button
                size="mini"
                type="text"
                icon="el-icon-details"
                @click="handleDetails(scope.row)"
                v-hasPermi="['contract:contract:query']"
              >
                <svg-icon class="svg" icon-class="details"/>
                查看
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <pagination
        v-show="changeRecordtotal>0"
        :total="total"
        :page.sync="queryChangeRecordParams.pageNum"
        :limit.sync="queryChangeRecordParams.pageSize"
        @pagination="getList"
      />
    </el-dialog>

    <!--变更记录查看-->
    <el-dialog :title="title" :visible.sync="openBgjlView" width="900px" append-to-body @close="cancelfs">
      <el-form ref="form" :model="form" :rules="rules" label-width="95px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="合同类型">
              <el-select v-model="form.httype" style="width: 100%" disabled>
                <el-option
                  v-for="dict in contractTypeOptions"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="合同编号">
              <el-input v-model="form.htbm" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="甲方名称">
              <el-input v-model="form.jfmc" disabled/>
              <el-input v-show="1==2" v-model="form.jfbm"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="甲方证件号" prop="jfzjhm">
              <el-input v-model="form.jfzjhm" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="乙方名称" prop="cbfmc">
              <el-input v-model="form.cbfmc" disabled/>
              <el-input v-show="1==2" v-model="form.cbfbm"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="乙方证件号" prop="cbfzjhm">
              <el-input v-model="form.cbfzjhm" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="地块编码">
              <el-select v-model="form.dkbm" style="width: 100%"
                         @change="selectDk" disabled
              >
                <el-option
                  v-for="item in this.dkData"
                  :key="item.dkmc"
                  :label="item.dkbm"
                  :value="item.dkbm">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="地块名称" prop="dkmc">
              <el-input v-model="form.dkmc" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="面积（亩）">
              <el-input v-model="form.htmj" disabled/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="收款方">
              <el-input v-model="form.skrmc" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="收款方账号">
              <el-input v-model="form.skrkh" disabled @input="formatCardNumber"
                        ref="cardInput"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="开户行">
              <el-input v-model="form.skrkhh" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="承包期限起">
              <el-date-picker disabled clearable size="small" style="width: 100%"
                              v-model="form.cbqxq"
                              type="date"
                              value-format="yyyy-MM-dd"
                              placeholder="选择承包期限起">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="承包期限止">
              <el-date-picker disabled clearable size="small" style="width: 100%"
                              v-model="form.cbqxz"
                              type="date"
                              value-format="yyyy-MM-dd"
                              placeholder="选择承包期限止">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="合同金额">
              <el-input v-model="form.htzje" disabled/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话" prop="dsfdh">
              <el-input v-model="form.dsfdh" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="备注" prop="remark">
          <el-input type="textarea" v-model="form.remark" disabled/>
        </el-form-item>
        <el-form-item label="附件" prop="fj">
          <el-upload
            class="avatar-uploader"
            :action="productFileAction"
            :file-list="fileList"
            list-type="picture-card"
            :headers="headers"
            :on-preview="handlePreview"
            :on-remove="handleRemove"
            :on-success="uploadSuccess"
            limit="10"
disabled
            accept="image/jpeg,image/jpg,image/png"
            name="uploadfiles">
            <i class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>

         <!-- <el-upload
            class="upload-demo"
            :file-list="fileList"
            :action="productFileAction"
            :headers="headers"
            :on-preview="handlePreview"
            multiple
            accept="image/*"
            name="uploadfiles">
          </el-upload>-->
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="cancelfs">确 定</el-button>
      </div>
    </el-dialog>

    <!--选择组织机构-->
    <el-dialog :title="title" :visible.sync="openDept" width="900px" append-to-body>
      <el-form :model="queryDeptParams" ref="queryDeptForm" :inline="true" v-show="showSearch">
        <el-form-item label="机构名称" prop="deptName">
          <el-input
            v-model="queryDeptParams.deptName"
            placeholder="请输入机构名称"
            clearable
            size="small"
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item>
          <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleDeptQuery">搜索</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="resetDeptQuery">重置</el-button>
        </el-form-item>
      </el-form>

      <!--      default-expand-all-->
      <el-table
        v-loading="loading"
        :data="deptList"
        ref="multipleTable"
        @select="handleSelect"
        @current-change="handleCurrentChange"
        @selection-change="handleDeptSelectionChange"
        row-key="deptId"
        :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
      >
        <el-table-column type="selection" width="55" align="center"/>
        <el-table-column prop="deptName" label="机构名称"></el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancelDept">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  addCBHT,
  approvalList,
  approvalNo,
  approvalPass,
  changeDetails,
  changeList,
  delCBHT,
  exportCBHT,
  getCBHT,
  getCode,
  listCBHT,
  newfile,
  submitCBHT,
  updateCBHT,
  updateChange,
  updateContractAttachment
} from "@/api/htgl/CBHT";
import {getContractEditAccountingItem, getEvaluationAccountingItem} from "@/api/pggl/evaluationAccounting";
import {childlistUse, listDept} from "@/api/system/dept";
import {getInfo} from "@/api/login";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import {listCBF} from "@/api/chgl/cbf";
import {listDK} from "@/api/chgl/dk";
import {getToken} from "@/utils/auth";
import {listNumber} from "@/api/zjgl/bank";

export default {
  name: "CBHT",
  components: {Treeselect},
  data() {
    const bankAccountValid = (rule, value, callback) => {
      value = value.replace(/\s*/g, '');
      const strBin = '10,18,30,35,37,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,58,60,62,65,68,69,84,87,88,94,95,98,99'
      if (!value) {
        return callback(new Error('银行卡号不符合规范'));
      } else if (!Number.isInteger(+value)) {
        callback(new Error('银行卡号不符合规范'));
      } else if (value.trim().length < 12 || value.trim().length > 19) {
        // callback(new Error('银行卡号长度必须在12到19之间'))
        callback(new Error('银行卡号不符合规范'));
      } else if (strBin.indexOf(value.substring(0, 2)) === -1) {
        callback(new Error('银行卡号不符合规范'));
      } else {
        callback()
      }
    }
    return {
      startDatePicker: this.beginDate(),
      endDatePicker: this.processDate(),
      activeName: '1',//展开name为1的折叠板
      dialogVisible: false,
      bankName: '',
      dialogImageUrl: '',
      fileList: [],
      imageTempList: [],
      compensationtype: [],
      num: 0,
      limit: 5,
      imageList: "",
      printObj: {
        id: "printMe",
        extraHead: '<meta http-equiv="Content-Language"content="zh-cn"/>',
      },
      currentPage: 0, // pdf文件页码
      pageCount: 0, // pdf文件总页数
      fileType: 'pdf', // 文件类型
      src: '', // pdf文件地址
      // 遮罩层
      loading: false,
      loadingBank: false,
      // 选中数组
      ids: [],
      pgfids: [],
      deptCode: '',
      city: '',
      town: '',
      village: '',
      cityShow: '',
      townShow: '',
      villageShow: '',
      cityData: [],
      townData: [],
      villageData: [],
      fjData: [{
        value: "Y",
        name: "上传"
      }, {
        value: "N",
        name: "未上传"
      }],
      dkData: [],
      headers: {Authorization: 'Bearer ' + getToken()},
      productFileAction: process.env.VUE_APP_BASE_API + '/system/resource/profile/upload',
      productfileList: [],
      pdfurls: '',
      cbfbm: '',
      cbfmc: '',
      cbfList: [
        {}
      ],
      // 非单个禁用
      single: true,
      multiple: true,
      cbfsingle: true,
      // 非多个禁用
      cbfmultiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      changeRecordtotal: 0,
      cbftotal: 0,
      testData: '',
      // 菜单树选项
      deptOptions: [],
      jfbm: "",
      pgList: [],
      deptList: [],
      CBHTList: [],
      changeRecordList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      openfj: false,
      openListDetails: false,
      openbg: false,
      openfs: false,
      openfspl: false,
      openDetails: false,
      openDept: false,
      opencbf: false,
      openShjl: false,
      openBgjl: false,
      openBgjlView: false,
      openbank: false,
      openView: false,
      // 开户行管理表格数据
      numberList: [],
      recordList: [],
      numbertotal: 0,
      recordtotal: 0,
      // 查询参数
      queryDeptParams: {
        deptName: undefined,
        status: undefined
      },
      // 菜单状态数据字典
      statusOptions: [],
      contractOptions: [],
      contractTypeOptions: [],
      approveStatus: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        htbm: null,
        name: null,
        jfmc: null,
        city: null,
        town: null,
        village: null,
        cbqxq: null,
        shzt: null,
        cbfbm: null,
        year: null,
      },
      queryPgParams: {
        pageNum: 1,
        pageSize: 10,
        htbm: null,
        name: null,
        city: null,
        town: null,
        village: null,
        cbqxq: null,
        shzt: null,
        cbfbm: null,
      },
      queryBankParams: {
        pageNum: 1,
        pageSize: 10,
        name: null,
        city: null,
      },
      queryChangeRecordParams: {
        pageNum: 1,
        pageSize: 10,
        htbm: null,
        name: null,
        city: null,
        by3: null,
        town: null,
        village: null,
        cbqxq: null,
        shzt: null,
      },
      // 审核查询参数
      queryExamineParams: {
        pageNum: 1,
        pageSize: 10,
        name: null,
        contractId: null,
        shzt: null,
      },
      queryCbfParams: {
        pageNum: 1,
        pageSize: 10,
        cbfmc: null,
      },
      // 表单参数
      form: {},
      formfs: {},
      // 表单校验
      rules: {
        deptName: [
          {required: true, message: "组织机构不能为空", trigger: "blur"}
        ],
        // status: [
        //   {required: true, message: "复审状态不能为空", trigger: "blur"}
        // ],
        htbm: [
          {required: true, message: "合同编号不能为空", trigger: "blur"}
        ],
        jfmc: [
          {required: true, message: "甲方名称不能为空", trigger: "blur"}
        ],
        httype: [
          {required: true, message: "合同类型不能为空", trigger: "blur"}
        ],
        cbfmc: [
          {required: true, message: "乙方名称不能为空", trigger: "blur"}
        ],
        dkbm: [
          {required: true, message: "地块编码不能为空", trigger: "blur"}
        ],
        htmj: [
          {required: true, message: "面积不能为空", trigger: "blur"}
        ],
        skrmc: [
          {required: true, message: "收款人不能为空", trigger: "blur"}
        ],
        skrkhh: [
          {required: true, message: "开户行不能为空", trigger: "blur"}
        ],
        skryhbh: [
          {required: true, message: "联行号不能为空", trigger: "blur"}
        ],
        skrkh: [
          {required: true, message: "银行卡不能为空", trigger: "blur"}, {validator: bankAccountValid, trigger: 'blur'}
        ],
        dsfdh: [
          {
            pattern: /(\d{11})|^((\d{7,8})|(\d{4}|\d{3})-(\d{7,8})|(\d{4}|\d{3})-(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})|(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1}))$/,
            message: "请输入正确的联系电话",
            trigger: "blur"
          }
        ],
        jfzjhm: [
          {
            pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
            message: "请输入正确的甲方证件号",
            trigger: "blur"
          }
        ],
        cbfzjhm: [
          {
            pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
            message: "请输入正确的乙方证件号",
            trigger: "blur"
          }
        ],
        cbqxq: [
          {required: true, message: "承包期限起不能为空", trigger: "blur"}
        ],
        cbqxz: [
          {required: true, message: "承包期限止不能为空", trigger: "blur"}
        ],
        htzje: [
          {required: true, message: "合同金额不能为空", trigger: "blur"}
        ],
      },
      rules1: {
        status: [
          {required: true, message: "复审状态不能为空", trigger: "blur"}
        ],
      }
    };
  },
  /*watch:{
    //每次变化，input获取焦点
    form:function(a,b){
      if(b == true){
        this.$refs.cbfmc.focus();
      }
    }
  },*/
  created() {
    this.getDicts("sys_evaluation_type").then(response => {
      this.compensationtype = response.data;
    });
    this.getList();
    this.getDeptList();
    this.childlist(1306);
    this.getDicts("sys_contract_status").then(response => {
      this.contractOptions = response.data;
    });
    this.getDicts("sys_contract_type").then(response => {
      this.contractTypeOptions = response.data;
    });
    this.getDicts("sys_normal_disable").then(response => {
      this.statusOptions = response.data;
    });
    this.getDicts('sys_approve_status').then(response => {
      this.approveStatus = response.data
    });
    getInfo().then(response => {
      let deptCode = response.user.dept.deptCode;
      this.deptCode = deptCode;
      if (deptCode.length == 4) {//新区
        this.cityShow = true;
        this.townShow = true;
        this.villageShow = true;
        childlistUse(deptCode).then(response => {
          this.cityData = response.data;
        });
      } else if (deptCode.length == 6) {//县
        this.cityShow = false;
        this.townShow = true;
        this.villageShow = true;
        childlistUse(deptCode).then(response => {
          this.townData = response.data;
        });
      } else if (deptCode.length == 9) {//镇
        this.cityShow = false;
        this.townShow = false;
        this.villageShow = true;
        childlistUse(deptCode).then(response => {
          this.villageData = response.data;
        });
      } else if (deptCode.length == 12) {//村
        this.cityShow = false;
        this.townShow = false;
        this.villageShow = false;
      } else {
        this.childlist(1306);
        this.cityShow = true;
        this.townShow = true;
        this.villageShow = true;
      }
    });

  },
  methods: {
    beginDate() {
      const self = this
      return {
        disabledDate(time) {
          if (self.form.cbqxz) {  //如果结束时间不为空，则小于结束时间
            return new Date(self.form.cbqxz).getTime() < time.getTime()
          } else {
            // return time.getTime() > Date.now()//开始时间不选时，结束时间最大值小于等于当天
          }
        }
      }
    },
    processDate() {
      const self = this
      return {
        disabledDate(time) {
          if (self.form.cbqxq) {  //如果开始时间不为空，则结束时间大于开始时间
            return new Date(self.form.cbqxq).getTime() > time.getTime()
          } else {
            // return time.getTime() > Date.now()//开始时间不选时，结束时间最大值小于等于当天
          }
        }
      }
    },
    // 支付方式字典翻译
    compensationtypeFormat(row, column) {
      return this.selectDictLabel(this.compensationtype, row.compensationType);
    },
    getBankList() {
      this.loadingBank = true;
      listNumber(this.queryBankParams).then(response => {
        this.numberList = response.rows;
        this.numbertotal = response.total;
        this.loadingBank = false;
      });
    },
    checkboxT(row, rowIndex) {
      if (row.shzt == 2 || row.shzt == 1) {
        return false;//禁用
      } else {
        return true;//不禁用
      }
    },
    handleRemove(file, fileList) {
      let _this = this;
      let url = "";
      let htfj = this.form.htfj;
      if (file.url.indexOf("blob:") > -1) {
        url = file.response.data[0];
        htfj = htfj.split(',');
        let newhtfj = '';
        htfj.forEach((item, i) => {
          if (item.indexOf(url) < 0) {
            if (newhtfj == "") {
              newhtfj = item;
            } else {
              newhtfj = newhtfj + "," + item;
            }
          }
        });
        _this.imageList = newhtfj;
        _this.form.htfj = newhtfj;
      } else {
        url = file.url;
        htfj = htfj.split(',');
        let newhtfj = '';
        htfj.forEach((item, i) => {
          if (item.indexOf(url) < 0) {
            if (newhtfj == "") {
              newhtfj = item;
            } else {
              newhtfj = newhtfj + "," + item;
            }
          }
        });
        _this.imageList = newhtfj;
        _this.form.htfj = newhtfj;
      }
    },
    handlePreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    handleExceed(files, fileList) {
      this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
    },
    beforeRemove(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`);
    },
    pdferr(errurl) {
      console.log(errurl);
    },
    beforeUpload(file) {
      let name=file.name.split(".");
      let fileType=name[name.length-1];
      // 图片显示前做一下判断
      let isJPG = "jpeg|png|jpg".indexOf(fileType)>-1;
      const isLt5M = file.size / 1024 / 1024 < 5;
      if (!isJPG) {
        this.$message.error('上传图片格式不对,只允许上传jpeg、png、jpg格式!');
      }
      if (!isLt5M) {
        this.$message.error('上传头像图片大小不能超过 5MB!');
      }
      return isJPG && isLt5M;
    },
    uploadSuccess(response, file, fileList) {
      if (response.code == 200) {
        let url = process.env.VUE_APP_BASE_API + response.data[0];
        let imageInfo = {name: file.name, url: url};
        this.imageTempList.push(imageInfo);
        if (this.imageList == "") {
          this.imageList = this.imageList + url;
          this.form.htfj = this.imageList;
        } else {
          this.imageList = this.imageList + "," + url;
          this.form.htfj = this.imageList;
        }
        this.timer = setInterval(this.getImageList(fileList), 500);
      } else {
        this.$message.error(response.msg)
      }
    },
    masterFileMax(files, fileList) {
      this.$message.warning(`最多只允许上传 ${this.limit} 个附件。`);
    },
    getImageList(fileList) {
      if (this.imageTempList.length == fileList.length) {
        this.fileList = this.imageTempList;
        clearInterval(this.timer);
      }
    },
    selectDk(val) {
      let obj = this.dkData;
      obj.forEach((item, index) => {
        const dkbm = item.dkbm
        if (val == dkbm) {
          this.form.dkmc = item.dkmc;
          this.form.htmj = item.scmjm;
        }
      });

      getEvaluationAccountingItem(val).then(response => {
        this.pgList = response.rows;
        this.$refs.pgTable.toggleRowSelection(response.rows, true);

        /* this.pgList.forEach(row => {
           this.$refs.pgTable.toggleRowSelection(row);
         });*/
      });
    },
    getList() {
      this.loading = true;
      this.queryParams.httype = "1";
      this.queryParams.cbfbm = "";
      listCBHT(this.queryParams).then(response => {
        this.CBHTList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    childlist(deptCode) {
      childlistUse(deptCode).then(response => {
        this.cityData = response.data;
      });
    },
    /** 转换菜单数据结构 */
    normalizer(node) {
      if (node.children && !node.children.length) {
        delete node.children;
      }
      return {
        id: node.deptId,
        label: node.deptName,
        children: node.children
      };
    },
    getTreeselect() {
      listDept({deptCode: this.deptCode}).then(response => {
        this.deptOptions = [];
        const dept = {deptId: 0, deptName: '选择组织机构', children: []};
        dept.children = this.handleTree(response.data, "deptId");
        this.deptOptions.push(dept);
      });
    },
    // 获取当前选中部门的名称
    selectDepart(val) {
      // 清除数据
      // 乙方数据
      this.form.cbfmc = "";
      this.form.cbfbm = "";
      this.form.cbfzjhm = "";
      // 地块数据
      this.form.dkbm = "";
      this.form.dkmc = "";
      this.form.htmj = "";
      this.dkData = [];
      // 评估数据
      this.pgList = [];
      this.pgfids = [];
      this.form.htzje = '';
      if (val.deptCode.length != 12) {
        this.$message.warning("请选择村");
        this.form.deptName = "";
        return false;
      }
      this.form.jfbm = val.deptCode;
      this.jfbm = val.deptCode;
      this.form.jfmc = val.deptName;
    },
    // 选择县
    selectCity(val) {
      this.queryParams.dkbm = val;
      this.city = val;
      if(val!=""&&val!=null) {
        childlistUse(val).then(response => {
          this.townData = response.data;
        });
      }
    },
    // 选择镇
    selectTown(val) {
      this.queryParams.dkbm = val;
      this.town = val;
      if(val!=""&&val!=null) {
        childlistUse(val).then(response => {
          this.villageData = response.data;
        });
      }
    },
    // 选择村
    selectVillage(val) {
      this.queryParams.dkbm = val;
      this.village = val;
    },
    getDeptList() {
      this.loading = true;
      listDept(this.queryDeptParams).then(response => {
        this.deptList = this.handleTree(response.data, "deptId");
        this.loading = false;
      });
    },
    getCbfList() {
      this.loading = true;
      this.queryCbfParams.cbfbm = this.jfbm;
      listCBF(this.queryCbfParams).then(response => {
        this.cbfList = response.rows;
        this.cbftotal = response.total;
        this.loading = false;
      });
    },
    handleSelect(val, row) {
      if (val.length > 1) {
        this.$refs.multipleTable.clearSelection() // 清空所有选择
        val.shift()
        this.$refs.multipleTable.toggleRowSelection(row) //  选中当前选择
      }
      let selected = val.length && val.indexOf(row) !== -1
    },
    // 单选行
    handleCurrentChange(val) {
      this.$refs.multipleTable.clearSelection() // 清空所有选择
      this.$refs.multipleTable.toggleRowSelection(val) //  选中当前选择
      //获取地块信息

    },
    handleDeptSelectionChange(val) {
      // if(val.length > 1){
      //   this.$refs.multipleTable.clearSelection()
      //   this.$refs.multipleTable.toggleRowSelection(val.pop())
      // }else{
      //   this.chek = val;
      // }
    },
    handleCbfSelect(row, val) {
      this.cbfbm = val.cbfbm
      this.cbfmc = val.cbfmc
      this.$refs.cbfTable.clearSelection() // 清空所有选择
      this.$refs.cbfTable.toggleRowSelection(val) //  选中当前选择
    },
    // 单选行
    handleCbfCurrentChange(val) {
      this.cbfbm = val.cbfbm;
      this.cbfmc = val.cbfmc;
      this.$refs.cbfTable.clearSelection() // 清空所有选择
      this.$refs.cbfTable.toggleRowSelection(val) //  选中当前选择
      //获取地块信息
      this.queryParams.cbfbm = val.cbfbm;
      listDK(this.queryParams).then(response => {
        this.dkData = response.rows;
      });
    },
    handleBankSelect(row, val) {
      this.bankName = val.bankName;
      this.bankNumber = val.bankNumber;
      this.$refs.bankTable.clearSelection(); // 清空所有选择
      this.$refs.bankTable.toggleRowSelection(val); //  选中当前选择
    },
    // 单选行
    handleBankCurrentChange(val) {
      this.bankName = val.bankName;
      this.bankNumber = val.bankNumber;
      this.$refs.bankTable.clearSelection(); // 清空所有选择
      this.$refs.bankTable.toggleRowSelection(val); //  选中当前选择
    },
    handleCbfSelectionChange(val) {
      /* this.cbfbm = val.cbfbm;
       this.cbfmc = val.cbfmc;*/
      // if(val.length > 1){
      //   this.$refs.multipleTable.clearSelection()
      //   this.$refs.multipleTable.toggleRowSelection(val.pop())
      // }else{
      //   this.chek = val;
      // }
    },
    // 单选行
    handlePgCurrentChange(val) {
      // this.$refs.pgTable.toggleRowSelection(val) //  选中当前选择
    },
    //评估选择
    handlePgSelectionChange(selection) {
      let htje = 0;
      let pgfids = selection.map(item => item.accountingItemId);
      this.pgfids = pgfids;
      selection.map(item => {
        htje = htje + parseInt(item.price);
      });
      this.form.htzje = htje;
      this.cbfsingle = selection.length !== 1;
      this.cbfmultiple = !selection.length;
    },
    confirmCbf() {
      this.opencbf = false;
      //获取地块信息
      this.queryPgParams.cbfbm = this.cbfbm
      listDK(this.queryPgParams).then(response => {
        this.dkData = response.rows;
        this.form.dkbm = this.dkData[0].dkbm;
        this.form.dkmc = this.dkData[0].dkmc;
        this.form.htmj = this.dkData[0].scmjm;

        this.form.cbfbm = this.cbfbm;
        this.form.cbfmc = this.cbfmc;
        this.form.skrmc = this.cbfmc;
        getContractEditAccountingItem(this.dkData[0].dkbm).then(response => {
          this.pgList = response.rows;
          this.$refs.pgTable.toggleRowSelection(response.rows);
        });
      });
      // this.$refs.cbfmc.focus;
      /*this.$refs.cbfmc1.focus()
      this.$refs.dsfdh.focus;*/
    },
    confirmBank() {
      this.form.skrkhh = this.bankName
      this.form.skryhbh = this.bankNumber
      this.openbank = false;
      this.$refs.skrkhh.focus();
    },
    onSelectAll() {
      this.$refs.tb.clearSelection()
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.openbg = false;
      this.openfj = false;
      this.openListDetails = false;
      this.reset();
      this.pgList = [];
      this.num = 0;
      this.fileList = [];
      this.cbfList = [];
    },
    cancelfs() {
      this.num = 0;
      this.openfs = false;
      this.openDetails = false;
      this.openfspl = false;
      this.openBgjlView = false;
      this.reset();
      this.fileList = [];
      this.pgList = [];
    },
    cancelDept() {
      this.openDept = false;
    },
    cancelCbf() {
      this.opencbf = false;
    },
    cancelBank() {
      this.openbank = false;
    },
    inputChange() { //输入框值改变
      this.pageIndex = this.pageIndex.replace(/[^\d]/g, '')
    },
    // 表单重置
    reset() {
      this.form = {
        deptName: null,
        contractId: null,
        httype: null,
        htbm: null,
        cbfmc: null,
        dkbm: null,
        dkmc: null,
        jfmc: null,
        by3: null,
        jfzjhm: null,
        cbfbm: null,
        cbfzjhm: null,
        cbqxq: null,
        cbqxz: null,
        htmj: null,
        dsfdh: null,
        dsfmc: null,
        htzje: null,
        skrmc: null,
        skrkhh: null,
        skryhbh: null,
        skrkh: null,
        remark: null,
        remarks: null,
        htfj: null,
        shzt: null,
        evaAccountingItemIds: null,
      };
      this.formfs = {
        status: null,
        contractId: null,
        remark: null,
      };
      this.queryDeptParams = {
        deptName: null,
        status: null
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    handleDeptQuery() {
      this.queryDeptParams.pageNum = 1;
      this.getDeptList();
    },
    handleBankQuery() {
      this.queryParams.pageNum = 1;
      this.getBankList();
    },
    /** 重置按钮操作 */
    resetBankQuery() {
      this.resetForm("queryBankForm");
      this.handleBankQuery();
    },
    handleCbfQuery() {
      this.queryCbfParams.pageNum = 1;
      this.getCbfList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.queryParams.dkbm = "";
      this.resetForm("queryForm");
      this.handleQuery();
    },
    resetCbfQuery() {
      this.resetForm("queryCbfForm");
      this.queryCbfParams.cbfmc = "";
      this.handleCbfQuery();
    },
    resetDeptQuery() {
      this.resetForm("queryDeptForm");
      this.handleDeptQuery();
    },
    // 菜单状态字典翻译
    contractFormat(row, column) {
      return this.selectDictLabel(this.contractOptions, row.shzt);
    },
    formatCardNumber(cardNum) {
      // 获取input的dom对象，element ui的el-input这样才能拿到
      const input = this.$refs.cardInput.$el.getElementsByTagName('input')[0]
      const cursorIndex = input.selectionStart
      const lineNumOfCursorLeft = (cardNum.slice(0, cursorIndex).match(/\s/g) || []).length
      const noLine = cardNum.replace(/\s/g, '')
      const newCardNum = noLine.replace(/\D+/g, '').replace(/(\d{4})/g, '$1 ').replace(/\s$/, '')
      const newLineNumOfCursorLeft = (newCardNum.slice(0, cursorIndex).match(/\s/g) || []).length
      const newCursorIndex = cursorIndex + newLineNumOfCursorLeft - lineNumOfCursorLeft
      this.$nextTick(() => {
        this.form.skrkh = newCardNum;
        this.$nextTick(() => {
          input.selectionStart = newCursorIndex
          input.selectionEnd = newCursorIndex
        })
      })
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.contractId)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },

    /*选择机构*/
    handleSelectDept() {
      this.reset();
      this.openDept = true;
      this.title = "选择";
    },
    handleSelectJf() {
      if (this.jfbm == "") {
        this.$message.warning("请选择组织机构，自动填充");
        return false;
      }
    },
    handleSelectCbf() {
      if (this.jfbm == "") {
        this.$message.warning("请先选择组织机构");
        return false;
      }
      this.opencbf = true;

      this.queryCbfParams.cbfbm = this.jfbm;
      listCBF(this.queryCbfParams).then(response => {
        this.cbfList = response.rows;
        this.cbftotal = response.total;
        this.loading = false;
      });
    },
    handleSelectBank() {
      this.openbank = true;
      this.getBankList();
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.getTreeselect();
      this.open = true;
      this.title = "新增";
      this.form.httype = this.contractTypeOptions[0].dictValue;
      this.cbfList = [];
      this.dkData = [];
      this.fileList = [];
      this.form.shzt = "";
      this.imageList = "";
      getCode().then(response => {
        this.form.htbm = response.msg;
      });
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.fileList = [];
      this.pgList = [];
      this.reset();
      this.getTreeselect();
      this.form.contractId = row.contractId;
      const id = row.contractId || this.ids;
      this.form.shzt = "";

      getCBHT(id).then(response => {
        let dkbm = row.dkbm;
        let htfj = response.data.htfj!=null?response.data.htfj.split(','):"";
        this.imageList = htfj;
        response.data.items.forEach((item) => {
          let obj = {
            accountingItemId: item.evaluationAccountingItemId,
            evaluationItemName: item.evaluationItemName,
            compensationType: item.compensationType,
            evaluationItemPrice: item.evaluationItemPrice,
            price: item.price,
            evaluationArea: item.evaluationArea
          }
          this.pgList.push(obj);
        });

        if (htfj != "") {
          htfj.forEach((item, i) => {
            let name = item.split('/')[item.split('/').length - 1];
            let imageInfo = {name: name, url: item};
            this.fileList.push(imageInfo);
          });
        }
        // 已选评估项
        let pgfids = response.data.items.map(item => item.evaluationAccountingItemId);
        this.pgfids = pgfids;
        getContractEditAccountingItem(dkbm).then(response => {
          response.rows.forEach((item) => {
            // this.pgList.push(item);
            let obj = {
              accountingItemId: item.accountingItemId,
              evaluationItemName: item.evaluationItemName,
              evaluationItemPrice: item.evaluationItemPrice,
              compensationType: item.compensationType,
              price: item.price,
              evaluationArea: item.evaluationArea
            }
            this.pgList.push(obj);
          });
          this.loading = false;
          this.pgList.forEach(row => {
            if (pgfids.indexOf(row.accountingItemId) > -1) {
              this.$refs.pgTable.toggleRowSelection(row);
            }
          });
        });

        this.queryParams.cbfbm = row.cbfbm;
        listDK(this.queryParams).then(response => {
          this.dkData = response.rows;
        });
        let obj = this.dkData;
        obj.forEach((item, index) => {
          if (dkbm == item.dkbm) {
            this.form.dkmc = item.dkmc;
          }
        })
        this.form = response.data;
        this.form.by3 = "0";
        this.form.skrkh = response.data.skrkh.replace(/\s/g, '').replace(/[^\d]/g, '').replace(/(\d{4})(?=\d)/g, '$1 ');
        this.open = true;
        this.title = "修改";
      });
    },
    handleUpdateFj(row) {
      this.openfj = true;
      this.title = "附件上传";
      this.fileList = [];
      this.pgList = [];
      this.reset();
      this.getTreeselect();
      this.form.shzt = "";

      this.form.contractId = row.contractId;
      const id = row.contractId || this.ids;
      getCBHT(id).then(response => {
        let dkbm = row.dkbm;
        let htfj=response.data.htfj;
        this.form.htfj = htfj;
        if (htfj != ""&&htfj != null&&htfj != undefined) {
          htfj = response.data.htfj.split(',');
          this.imageList = htfj;
        }
        response.data.items.forEach((item) => {
          let obj = {
            accountingItemId: item.evaluationAccountingItemId,
            evaluationItemName: item.evaluationItemName,
            evaluationItemPrice: item.evaluationItemPrice,
            price: item.price,
            evaluationArea: item.evaluationArea
          }
          this.pgList.push(obj);
        });

        if (htfj != ""&&htfj != null&&htfj != undefined) {
          htfj.forEach((item, i) => {
            let name = item.split('/')[item.split('/').length - 1];
            let imageInfo = {name: name, url: item};
            this.fileList.push(imageInfo);
          });
        }
        // 已选评估项
        let pgfids = response.data.items.map(item => item.evaluationAccountingItemId);
        this.pgfids = pgfids;
      });
    },

    // 合同变更
    handleChange(row) {
      this.form.shzt = "";

      this.fileList = [];
      this.pgList = [];
      this.reset();
      this.getTreeselect();
      this.form.contractId = row.contractId;
      const id = row.contractId || this.ids;
      getCBHT(id).then(response => {
        let dkbm = row.dkbm;
        let htfj = response.data.htfj!=null?response.data.htfj.split(','):"";

        this.imageList = htfj;
        response.data.items.forEach((item) => {
          let obj = {
            accountingItemId: item.evaluationAccountingItemId,
            evaluationItemName: item.evaluationItemName,
            evaluationItemPrice: item.evaluationItemPrice,
            price: item.price,
            evaluationArea: item.evaluationArea
          }
          this.pgList.push(obj);
        });

        if (htfj != "") {
          htfj.forEach((item, i) => {
            this.num++;
            let imageInfo = {name: '附件' + this.num, url: item};
            this.fileList.push(imageInfo);
          });
        }
        // 已选评估项
        let pgfids = response.data.items.map(item => item.evaluationAccountingItemId);
        this.pgfids = pgfids;
        getContractEditAccountingItem(dkbm).then(response => {
          response.rows.forEach((item) => {
            let obj = {
              accountingItemId: item.accountingItemId,
              evaluationItemName: item.evaluationItemName,
              evaluationItemPrice: item.evaluationItemPrice,
              price: item.price,
              evaluationArea: item.evaluationArea
            }
            this.pgList.push(obj);
          });
          this.loading = false;
          this.pgList.forEach(row => {
            if (pgfids.indexOf(row.accountingItemId) > -1) {
              this.$refs.pgTable.toggleRowSelection(row);
            }
          });
        });

        this.queryParams.cbfbm = row.cbfbm;
        listDK(this.queryParams).then(response => {
          this.dkData = response.rows;
        });
        let obj = this.dkData;
        obj.forEach((item, index) => {
          if (dkbm == item.dkbm) {
            this.form.dkmc = item.dkmc;
          }
        })

        this.form = response.data;
        this.form.by3 = "1";
        this.form.skrkh = response.data.skrkh.replace(/\s/g, '').replace(/[^\d]/g, '').replace(/(\d{4})(?=\d)/g, '$1 ');
        this.openbg = true;
        this.title = "合同变更";
      });
    },
    handleChangeRecord(row) {
      this.title = "变更记录";
      this.openBgjl = true;
      this.queryChangeRecordParams.contractId = row.contractId;
      this.queryChangeRecordParams.by3 = "1";
      changeList(this.queryChangeRecordParams).then(response => {
        this.changeRecordList = response.rows;
        this.changeRecordtotal = response.total;
      });
    },

    handleView(row) {
      this.title = "预览";
      if (row.htwj == ''||row.htwj==null ||row.htwj==undefined) {
        const loading = this.$loading({
          lock: true,
          text: 'Loading',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        });
        newfile(row.contractId).then(response => {
          loading.close();
          this.src = process.env.VUE_APP_BASE_API + response.data.path;
          this.pdfurls = process.env.VUE_APP_BASE_API + response.data.path;
          this.openDetails = true;
          this.getList();
        });
      } else {
        this.src = process.env.VUE_APP_BASE_API + row.htwj;
        this.pdfurls = process.env.VUE_APP_BASE_API + row.htwj;
        this.openDetails = true;
      }
    },

    handlefspl() {
      this.openfspl = true;
      this.title = "复审";
      this.reset();
      this.formfs.status = this.approveStatus[0].dictValue;
    },
    // 审核记录
    handleExamineRecord(row) {
      this.openShjl = true;
      this.queryExamineParams.contractId = row.contractId;
      approvalList(this.queryExamineParams).then(response => {
        this.recordList = response.rows;
        this.recordtotal = response.total;
      });
    },
    handleListDetails(row) {
      this.openListDetails = true;
      this.title = "详情";
      const id = row.contractId;
      this.fileList = [];
      this.imageList = "";
      getCBHT(id).then(response => {
        let dkbm = row.dkbm;
        let htfj = response.data.htfj!=null?response.data.htfj.split(','):"";
        this.imageList = htfj;
        response.data.items.forEach((item) => {
          let obj = {
            accountingItemId: item.evaluationAccountingItemId,
            evaluationItemName: item.evaluationItemName,
            compensationType: item.compensationType,
            evaluationItemPrice: item.evaluationItemPrice,
            price: item.price,
            evaluationArea: item.evaluationArea
          }
          this.pgList.push(obj);
        });

        if (htfj != "") {
          htfj.forEach((item, i) => {
            let name = item.split('/')[item.split('/').length - 1];
            let imageInfo = {name: name, url: item};
            this.fileList.push(imageInfo);
          });
        }
        // 已选评估项
        let pgfids = response.data.items.map(item => item.evaluationAccountingItemId);
        this.pgfids = pgfids;
        // getContractEditAccountingItem(dkbm).then(response => {
        //   response.rows.forEach((item) => {
        //     // this.pgList.push(item);
        //     let obj = {
        //       accountingItemId: item.accountingItemId,
        //       evaluationItemName: item.evaluationItemName,
        //       evaluationItemPrice: item.evaluationItemPrice,
        //       price: item.price,
        //       evaluationArea: item.evaluationArea
        //     }
        //     this.pgList.push(obj);
        //   });
        //   this.loading = false;
        //   this.pgList.forEach(row => {
        //     if (pgfids.indexOf(row.accountingItemId) > -1) {
        //       this.$refs.pgTable.toggleRowSelection(row);
        //     }
        //   });
        // });

        this.queryParams.cbfbm = row.cbfbm;
        listDK(this.queryParams).then(response => {
          this.dkData = response.rows;
        });
        let obj = this.dkData;
        obj.forEach((item, index) => {
          if (dkbm == item.dkbm) {
            this.form.dkmc = item.dkmc;
          }
        })
        this.form = response.data;
        this.form.skrkh = response.data.skrkh.replace(/\s/g, '').replace(/[^\d]/g, '').replace(/(\d{4})(?=\d)/g, '$1 ');
      });
      this.queryExamineParams.contractId = row.contractId;
      approvalList(this.queryExamineParams).then(response => {
        this.recordList = response.rows;
        this.recordtotal = response.total;
      });
    },
    handleDetails(row) {
      this.openBgjlView = true;
      changeDetails(row.contractChangeId).then(response => {
        this.form = response.data;
        let htfj = response.data.htfj!=null?response.data.htfj.split(','):"";
        if (htfj != "") {
          htfj.forEach((item, i) => {
            let name = item.split('/')[item.split('/').length - 1];
            let imageInfo = {name: name, url: item};
            this.fileList.push(imageInfo);
          });
        }
      });
    },
    getRecordList() {
      approvalList(this.queryExamineParams).then(response => {
        this.recordList = response.rows;
        this.recordtotal = response.total;
      });
    },
    /** 提交按钮 */
    handlefs(row) {
      this.fileList = [];
      this.openfs = true;
      this.title = "复审";
      this.reset();
      this.getTreeselect();
      const id = row.contractId;
      this.formfs.contractId = id;
      this.ids.push(id);
      getCBHT(id).then(response => {
        let dkbm = row.dkbm;
        response.data.items.forEach((item) => {
          this.pgList.push(item);
        });
        //合同附件
        if (response.data.htfj != "") {
          let htfj = response.data.htfj.split(',');
          htfj.forEach((item, i) => {
            let name = item.split('/')[item.split('/').length - 1];
            let imageInfo = {name: name, url: item};
            this.fileList.push(imageInfo);
          });
        }

        this.queryParams.cbfbm = row.cbfbm;
        listDK(this.queryParams).then(response => {
          this.dkData = response.rows;
        });
        let obj = this.dkData;
        obj.forEach((item, index) => {
          if (dkbm == item.dkbm) {
            this.form.dkmc = item.dkmc;
          }
        })
        this.form = response.data;
        this.form.remarks = response.data.remark;
        this.form.skrkh = response.data.skrkh.replace(/\s/g, '').replace(/[^\d]/g, '').replace(/(\d{4})(?=\d)/g, '$1 ');
        this.formfs.status = this.approveStatus[0].dictValue;
      });
    },
    selectStatus() {
      this.reset();
      this.formfs.remark = "";
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.pgfids.length < 1) {
            this.$message.warning("未选择评估项，请选择");
            return false;
          }
          let _this = this;
          this.$confirm('是否提交至审核人员审核?', '提示', {
            cancelButtonClass: 'btn-custom-cancel',
            confirmButtonText: '是',
            cancelButtonText: '否',
            type: 'warning'
          }).then(() => {
            const loading = this.$loading({
              lock: true,
              text: 'Loading',
              spinner: 'el-icon-loading',
              background: 'rgba(0, 0, 0, 0.7)'
            });
            this.form.skrkh = this.form.skrkh.replace(/\s*/g, '');
            this.form.evaAccountingItemIds = this.pgfids;
            // this.form.shzt = "1";
            if (this.form.contractId != null) {
              updateCBHT(this.form).then(response => {
                loading.close();
                this.msgSuccess("修改成功");
                let ids = [];
                _this.open = false;
                _this.openbg = false;
                _this.pgList = [];
                _this.fileList = [];
                _this.imageList = "";
                ids.push(this.form.contractId);
                submitCBHT({ids: ids}).then(response => {
                  _this.getList();
                });

              });
            } else {
              this.form.shzt = "1";
              addCBHT(this.form).then(response => {
                loading.close();
                this.msgSuccess("新增成功");
                this.open = false;
                this.openbg = false;
                this.getList();
                this.pgList = [];
                this.fileList = [];
                this.imageList = "";
              });
            }
          }).catch(() => {
            this.form.skrkh = this.form.skrkh.replace(/\s*/g, '');
            this.form.evaAccountingItemIds = this.pgfids;
            const loading = this.$loading({
              lock: true,
              text: 'Loading',
              spinner: 'el-icon-loading',
              background: 'rgba(0, 0, 0, 0.7)'
            });
            if (this.form.contractId != null) {
              updateCBHT(this.form).then(response => {
                loading.close();
                this.msgSuccess("修改成功");
                this.open = false;
                this.openbg = false;
                this.getList();
                this.pgList = [];
                this.fileList = [];
                this.imageList = "";
              });
            } else {
              this.form.shzt = "0";
              addCBHT(this.form).then(response => {
                loading.close();
                this.msgSuccess("新增成功");
                this.open = false;
                this.openbg = false;
                this.getList();
                this.pgList = [];
                this.fileList = [];
                this.imageList = "";
              });
            }
          });
        }
      });
    },
    submitChangeForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.pgfids.length < 1) {
            this.$message.warning("未选择评估项，请选择");
            return false;
          }
          this.form.shzt = "1";
          const loading = this.$loading({
            lock: true,
            text: 'Loading',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.7)'
          });
          this.form.skrkh = this.form.skrkh.replace(/\s*/g, '');
          this.form.evaAccountingItemIds = this.pgfids;
          // this.form.shzt = "1";
          updateChange(this.form).then(response => {
            loading.close();
            this.msgSuccess("修改成功");
            this.open = false;
            this.openbg = false;
            this.getList();
            this.pgList = [];
            this.fileList = [];
            this.imageList = "";
          });
          let ids = [];
          ids.push(this.form.contractId);
          submitCBHT({ids: ids}).then(response => {

          });
        }
      });
    },
    submitFormFj() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.pgfids.length < 1) {
            this.$message.warning("未选择评估项，请选择");
            return false;
          }
          const loading = this.$loading({
            lock: true,
            text: 'Loading',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.7)'
          });
          this.form.evaAccountingItemIds = this.pgfids;
          if (this.form.contractId != null) {
            updateContractAttachment(this.form).then(response => {
              loading.close();
              this.msgSuccess("操作成功");
              this.openfj = false;
              this.getList();
              this.pgList = [];
              this.fileList = [];
              this.imageList = "";
            });
          }
          /*else {
            addCBHT(this.form).then(response => {
              loading.close();
              this.msgSuccess("操作成功");
              this.openfj = false;
              this.getList();
              this.pgList = [];
              this.fileList = [];
              this.imageList="";
            });
          }*/
        }
      });
    },
    submitFormfs() {
      this.$refs["formfs"].validate(valid => {
        if (valid) {
          if (this.formfs.status == "3" && (this.formfs.remark == "" || this.formfs.remark == undefined || this.formfs.remark == null)) {
            this.$message.warning("复审意见不可为空");
            return false;
          }
          if (this.formfs.status == "2") {
            approvalPass({ids: this.ids, remark: this.formfs.remark}).then(response => {
              this.msgSuccess("操作成功");
              this.openfs = false;
              this.openfspl = false;
              this.getList();
            });
          } else {
            approvalNo({ids: this.ids, remark: this.formfs.remark}).then(response => {
              this.msgSuccess("操作成功");
              this.openfs = false;
              this.openfspl = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.contractId || this.ids;
      this.$confirm('是否确认删除数据项?', "警告", {
        cancelButtonClass: 'btn-custom-cancel',
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(function () {
        return delCBHT(ids);
      }).then(() => {
        this.getList();
        this.msgSuccess("删除成功");
        this.fileList = [];
        this.imageList = "";
      })
    },
    /** 导出按钮操作 */
    handleExport() {
      const queryParams = this.queryParams;
      this.$confirm('是否确认导出数据项?', "警告", {
        cancelButtonClass: 'btn-custom-cancel',
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(function () {
        return exportCBHT(queryParams);
      }).then(response => {
        this.download(response.msg);
      })
    }
  }
};
</script>
<style>
.btn-custom-cancel {
  float: right;
  margin-left: 10px;
}

.statusDv {
  display: flex;
  justify-content: center;
  align-items: center;
}

.statudPoint {
  border-radius: 50px;
  width: 6px;
  height: 6px;
  margin-right: 6px;
}

/*审核通过背景色*/
.Bg2 {
  background-color: #13ce66;
}

/*未提交*/
.Bg0 {
  background-color: #1890ff;
}

/*待审核*/
.Bg1 {
  background-color: orange;
}

/*审核失败*/
.Bg3 {
  background-color: red;
}

.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.avatar-uploader .el-upload:hover {
  border-color: #409EFF;
}

.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  height: 148px;
  line-height: 148px;
  text-align: center;
}

.avatar {
  width: 178px;
  height: 178px;
  display: block;
}


.maxtable {
  margin-top: 30px;
}

.per100 {
  background-color: #FDA49F !important;
}

.per75-100 {
  background-color: #F1D3AB !important;
}

.per50-75 {
  background-color: #F1E7AB !important;
}

.per25-50 {
  background-color: #C6FFFF !important;
}

.per0-25 {
  background-color: #C7F2AA !important;
}

.per-100 {
  background-color: #7CFA86 !important;
}

.ivu-table th {
  background-color: white;
}

.compare {
  color: #FFB806;
  cursor: pointer;
}

.credited {
  float: right;
  margin: 20px 15px 5px 15px;
}

.table {
  clear: both;
}

.colbor {
  display: inline-block;
  width: 30px;
  border: 1px solid #C4C8CC;
}

.ivu-col-span-3 {
  position: absolute;
  bottom: 0px;
  right: 10px;
}
</style>
